﻿package 
{
	import flash.display.Sprite;
	import flash.events.Event;
	import com.mochimedia.ui.*;
	import flash.text.StyleSheet;
	
	/**
	 * ...
	 * @author ...
	 */
	public class Main extends Sprite 
	{
		
		public var asui:ASUIObject;
		protected var _tm:TweenManager;
		
		public function Main():void 
		{
			if (stage) init();
			else addEventListener(Event.ADDED_TO_STAGE, init);
		}
		
		private function init(e:Event = null):void 
		{
			removeEventListener(Event.ADDED_TO_STAGE, init);

			// main container cell
			var b:Cell = new Cell(this, 400, 300, true, true);
				
			// content cell
			var c:Cell = b.addChild(new Cell(null, 360, 280, false, false, 0, new Position({ margins: 10 }))) as Cell;
			
			// menu group
			var mg:MenuGroup = new MenuGroup(null, "File", ["Load...", "Save", "Save as...", "Revert", "Delete"], Position.POSITION_ABOVE, NaN, new Position( { placement: Position.PLACEMENT_FLOAT } ));
			b.addChild(mg);
			
			// exampe event callback
			mg.addMenuListener(Component.EVENT_CLICK, test);
			
			// second menu example, notice how floats place menus side-by-side
			mg = new MenuGroup(null, "Edit", ["Copy", "Paste", "Cut", "Clear", "Remove Transformations"], -1, NaN, new Position( { placement: Position.PLACEMENT_FLOAT } ));
			b.addChild(mg);
			
			// tab group for switching to different cells of content
			var tg:TabGroup = new TabGroup(null, ["One", "Two", "Three"], 1);
			c.addChild(tg);

			// HTML field for HTML text
			var d:HTMLField;
			d = c.addChild(new HTMLField(null, "<p>Dude <b>dude</b></p>")) as HTMLField;
			d = c.addChild(new HTMLField(null, "Dude")) as HTMLField;
			
			Position.defaultMarginBottom = 10;
			
			// button
			var f:BButton;
			f = c.addChild(new BButton(null, "Apples", -1, 200)) as BButton;
			f.addOnClick(test);
			
			// combo box
			var cob:ComboBox = new ComboBox(null, "Items", ["Fame", "Fortune", "Love", "Happiness"], 0, "Do it!");
			c.addChild(cob);
			
			// combo box event listener
			cob.addEventListener(Component.EVENT_CLICK, onSelect);
			
			// toggle button
			var tb:ToggleButton = c.addChild(new ToggleButton(null, Create.ICON_PLAY, Create.ICON_PAUSE, false, -1, 30, 30)) as ToggleButton;
			tb.addEventListener(Component.EVENT_CLICK, onToggle);
			
			// button with icon
			f = c.addChild(new BButton(null, Create.ICON_CLOSE, -1, 30, 30)) as BButton;
			f.disable();
			
			// html field with link
			var hf:HTMLField = c.addChild(
				new HTMLField(null, 
					'<p>This is an <b>HTML Field</b> with <a href="event:mylink">a link</a>.  Yeah baby!</p>')) as HTMLField;
			
			hf.addEventListener(Component.EVENT_CLICK, onLinkClicked);
					
			// form field	
			var ff:FormField = new FormField(null, "Enter text...", 200);
			c.addChild(ff);
			
			// radio button group
			var rb:RadioButton = new RadioButton(null, "Hot", "hot", "temperature", false, 100, NaN, new Position( { placement: Position.PLACEMENT_FLOAT } ));
			c.addChild(rb);
			rb.addEventListener(Component.EVENT_CLICK, onChoice);
			rb = new RadioButton(null, "Cold", "cold", "temperature", false, 100, NaN, new Position( { placement: Position.PLACEMENT_FLOAT } ));
			c.addChild(rb);
			rb.addEventListener(Component.EVENT_CLICK, onChoice);
			
			c.addChild(new HRule());
			
			// checkbox
			var cb:CheckBox = c.addChild(new CheckBox(null, "Orange")) as CheckBox;
			
			// scroll bar for content cell
			var sb:ScrollBar = b.addChild(new ScrollBar(null)) as ScrollBar;
			sb.targetCell = c;	
			
			// HTML for ASUIObject
			var html:String = ( <![CDATA[
			
				<div>
					<img class="thumb" src="http://s3.amazonaws.com/twitter_production/profile_images/107885135/geoff2_normal.jpg" width="40" height="40" />
					<div class="meta">
						<h2 class="name">Geoff</h2>
						<hr class="line" />
						<p class="desc">A pretty nice guy.</p>
					</div>
					<div class="controls">
						<input class="control_add" type="button" name="add_item" value="NO WAY" />
						<input class="control_increase" type="button" name="add_item" icon="ICON_PLUS" />
					</div>
				</div>
				
				]]> ).toString();
				
			// CSS for ASUIObject
			var css:String = ( <![CDATA[
			
				.thumb { float: left; width: 40; marginRight: 10; }
				.meta { width:200px;  float: left; }
				.name { width:200px; height: 10px; margins: 0; marginBottom: 0; }
				.line { height: 2; marginBottom: 0; margins: 0; }
				.desc { height: 20px; margins: 0; }
				.controls { width: 80px; float: left; margins: 0; textAlign: center; }
				.control_add { position: absolute; backgroundColor: #000000; margins: 0; color: #ffffff; }
				.control_remove { position: absolute; }
				.control_increase { visibility: hidden; }
				.purchased { fontSize: 16px; color: #666666; }
				
				]]> ).toString();
			
			asui = new ASUIObject(null, 450, 200, html, css);
					
			asui.addEventListener(Component.EVENT_CHANGE, onChange);
			asui.addEventListener(Component.EVENT_CLICK, onChange);
			
			c.addChild(asui);
			
			var html2:String = (<![CDATA[ 
				<div class="controlpanel">
					<input type="button" class="controls" icon="ICON_PREVTRACK" />
					<input type="button" class="controls" icon="ICON_REWIND" />
					<input type="toggle" class="controls" icon="ICON_PLAY" toggledicon="ICON_PAUSE" />
					<input type="button" class="controls" icon="ICON_FASTFORWARD" />
					<input type="button" class="controls" icon="ICON_NEXTTRACK" />
				</div>
				]]> ).toString();
				
			var css2:String = (<![CDATA[ 
				.controlpanel { width: 160; height: 32; }
				.controls { float: left; backgroundColor: 0x000000; color: 0xffffff; } 
				]]> ).toString();
				
			var asui2:ASUIObject = new ASUIObject(null, 160, 32, html2, css2);
			
			c.addChild(asui2);

			// tweeeeeens
			_tm = new TweenManager(false);
			_tm.createTween(f, "x", 0, 100, 1, true, true, 0, 0, Tween.EASE_INOUT, Tween.STYLE_CUBIC);

		}
		
		protected function test (e:Event):void {
			
			trace(e,e.target,e.target.value);
			
		}
		
		protected function onToggle (e:Event):void {
			
			trace(e.target.toggled);
			if (e.target.toggled) _tm.start();
			else _tm.stop();
			
		}
		
		protected function onSelect (e:Event):void {
			
			trace("You selected", e.target.value);
			
		}
		
		public function onChange (e:Event):void {
			
			trace("change");
			for (var param:String in asui.form) trace(param + "->" + asui.form[param]);
			
		}
		
		protected function onChoice (e:Event):void {
			
			trace(RadioButton.groups.temperature.value);			
			
		}
		
		protected function onLinkClicked (e:Event):void {
			
			trace("Link clicked:", e.target.linkEvent);
			
		}
		
	}
	
}